import 'package:flutter/material.dart';
import 'package:full_display/common/qxp_color.dart';
import 'package:full_display/common/qxp_style.dart';
import 'package:full_display/page/clouds/clouds_add_cluster_page.dart';
import 'package:full_display/page/clouds/clouds_add_splicing_page.dart';
import 'package:full_display/page/clouds/clouds_cluster_detail_page.dart';
import 'package:full_display/page/clouds/clouds_device_detail.page.dart';
import 'package:full_display/page/clouds/clouds_splicing_detail_page.dart';
import 'package:full_display/page/clouds/component/clouds_item.dart';
import 'package:full_display/page/clouds/component/pop_menus.dart';
import 'package:full_display/provide/button_list_provider.dart';
import 'package:full_display/routers/route_name.dart';
import 'package:full_display/unit/asset_utils/asset_utils.dart';
import 'package:full_display/unit/navigation/navigation_util.dart';
import 'package:full_display/unit/screen/screen_util1.dart';
import 'package:full_display/unit/screen/screen_utility.dart';
import 'package:full_display/unit/widgets/widget_button_list.dart';
import 'package:provider/provider.dart';

class CloudsPage extends StatefulWidget {
  const CloudsPage({super.key});

  @override
  State<CloudsPage> createState() => _CloudsPageState();
}

class _CloudsPageState extends State<CloudsPage> {
  late ButtonListProvider _btnListData;
  @override
  Widget build(BuildContext context) {
    _btnListData = context.watch<ButtonListProvider>();
    return Scaffold(
      backgroundColor: ColorPlate.background,
      resizeToAvoidBottomInset: false,
      appBar: AppBar(
        backgroundColor: ColorPlate.background,
        elevation: 0,
        actions: [
          IconButton(
            icon: Image.asset(
              height: 24.0.H,
              width: 24.0.W,
              AssetUtils.getAsset2Image("my_info"),
            ),
            onPressed: () {},
          ),
          IconButton(
            icon: Image.asset(
              height: 24.0.H,
              width: 24.0.W,
              AssetUtils.getAsset2Image("icon_add"),
            ),
            onPressed: () {
              PopMenus.showPop(
                  context: context,
                  listData: [
                    {'title': '扫一扫', 'img': 'icon_scan'},
                    {'title': '添加设备', 'img': 'icon_tianjia'},
                    {'title': '添加集群', 'img': 'icon_jiqun'},
                    {'title': '添加云拼接', 'img': 'icon_yunpinjie'}
                  ],
                  selText: "1",
                  isImg: true,
                  itemHeight: 50.0.H,
                  itemWidth: 150.0.H,
                  topH: ScreenUtil1.statusBarHeight + 24,
                  leftP: ScreenUtil1.screenWidth - 150.0.H - 6,
                  trianglePosition: 10.0,
                  clickCallback: (int index, Map value) {
                    print("++++++${index}");
                    if (index == 0) {
                    } else if (index == 1) {
                    } else if (index == 2) {
                      NavigationUtil.getInstance().pushPage(
                        context,
                        RouteNames.cloudsAddClusterPage,
                        widget: const CloudsAddClusterPage(),
                      );
                    } else if (index == 3) {
                      NavigationUtil.getInstance().pushPage(
                        context,
                        RouteNames.cloudsAddAplicingPage,
                        widget: const CloudsAddAplicingPage(),
                      );
                    }
                  });
            },
          ),
        ],
      ),
      body: Padding(
        padding: EdgeInsets.all(20.0.W),
        child: Center(
          child: Column(
            children: [
              Container(
                height: 30.0.H,
              ),
              ButtonListWidget(
                btnList: _btnListData.cloudsBtnList,
                tapAction: btnClick,
                isBg: false,
              ),
              Container(
                height: 20.0.H,
              ),
              Expanded(
                child: Container(
                  width: ScreenUtil1.screenWidth - 40.0.H,
                  decoration: const BoxDecoration(
                    color: ColorPlate.backgroundOpacity5,
                    borderRadius: BorderRadius.all(Radius.circular(12.0)),
                  ),
                  child: CloudsItem(),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  void btnClick(int index, BuildContext context) {
    if (index == 0) {
      NavigationUtil.getInstance().pushPage(
        context,
        RouteNames.cloudsDeviceDetailPage,
        widget: const CloudsDeviceDetailPage(),
      );
    } else if (index == 1) {
      NavigationUtil.getInstance().pushPage(
        context,
        RouteNames.cloudsClusterDetailPage,
        widget: const CloudsClusterDetailPage(),
      );
    } else {
      NavigationUtil.getInstance().pushPage(
        context,
        RouteNames.cloudsSplicingDetailPage,
        widget: const CloudsSplicingDetailPage(),
      );
    }
  }
}
